package myJs.cps.myTable

import japgolly.scalajs.react._
import japgolly.scalajs.react.vdom.all._
import myJs.cps._
import myJs.myPkg.i18n.ReactI18next

import scala.collection.immutable.SeqMap
import scala.scalajs.js

/** Created by yz on 15/9/2023
  */
object TextSearchLiCp {

  case class Props(
      searchType: String,
      searchTypeChange: String => Callback,
      text: String,
      textChange: String => Callback
  ) {
    @inline def render: VdomElement = {
      Component(this)
    }
  }

  val Component = ScalaFnComponent[Props] { props =>
    val js.Tuple3(t, i18n, _) = ReactI18next.useTranslation()
    li(
      className := "myLi myInputLi",
      div(
        marginBottom := 10.px,
        span(className := "fa fa-filter"),
        s" ${t("screening")}"
      ),
      div(
        marginBottom := 5.px,
        className := "form-group",
        div(
          className := "col-sm-12",
          PureSelectCp
            .Props(
              name = "searchType",
              optionMap = SeqMap("like" -> t("fuzzy"), "equals" -> t("accurate")),
              value = props.searchType,
              onChange = props.searchTypeChange
            )
            .render
        )
      ),
      div(
        className := "form-group",
        div(
          className := "col-sm-12",
          PureTextareaCp.Props(
            placeHolder = s"${t("screeningPlaceholder")}",
            value = props.text,
            onChange = props.textChange
          ).render
        )
      )
    )

  }

}
